<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="UTF-8" name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=no">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="renderer" content="webkit">
    <title>青岛航空大数据可视化分析平台</title>
    <link rel="stylesheet" href="css/common.css">
    <link rel="stylesheet" href="css/index.css">
    <script src="assets/js/jquery-3.3.1.min.js"></script>
    <script src="js/common.js"></script>
</head>

<body id="index">
<div id="container">
    <script>
        pageResize();//写到这里可以让页面加载时不出现缩放动画
    </script>
    <header id="mainHeader">
        <div class="userInfo">
            <i class="icon-onDuty"></i>
            <span>值班<span class="num">1</span>号： <span id="on_duty" class="username"></span> </span>
        </div>
        <h1>青岛航空大数据可视化分析平台</h1>
        <ul class="info">
            <!--天气不需要了
            <li class="weatherBox">
                <i class="weatherIcon" id="weatherIcon"></i>
                <ul>
                    <li class="temperature" id="temperature"></li>
                    <li class="weather" id="weather"></li>
                </ul>

            </li>-->
            <li class="timeBox">
                <span class="time"></span>
                <span class="date"></span>
            </li>
        </ul>
    </header>
    <main id="main">
        <div class="l myBg">
            <h3>运营指标</h3>
            <div class="l-t">
                <h4>收入</h4>
                <header>
                    <h5>昨日收入</h5><strong id="income_with_charter"></strong><span class="unit">万元</span><i></i>
                </header>
                <ul>
                    <li><i class="icon-money1"></i><h5>月累计收入</h5><strong id="mon_income_with_charter"></strong>
                        <span class="unit">万元</span>
                    </li>
                    <li><i class="icon-money2"></i><h5>座公里收入</h5><strong id="site_income_with_charter"></strong>
                        <span class="unit">元</span>
                    </li>
                    <li><i class="icon-money3"></i><h5>小时收入&emsp;</h5><strong id="hour_income_with_charter"></strong>
                        <span class="unit">万元</span>
                    </li>
                </ul>
            </div>
            <div class="l-m">
                <h4>利润</h4>
                <header>
                    <h5>昨日利润</h5><strong id="all_profit"></strong>万元
                </header>
                <ul>
                    <li>
                        <i class="icon-coins"></i><h5>月累计成本</h5><strong id="all_cost"></strong>
                        <span class="unit">万元</span>
                    </li>
                    <li>
                        <i class="icon-coins"></i><h5>座公里成本</h5><strong id="site_mul_cost"></strong>
                        <span class="unit">元</span>
                    </li>
                    <li>
                        <i class="icon-coins"></i><h5>小时成本&emsp;</h5><strong id="hour_cost"></strong>
                        <span class="unit">万元</span>
                    </li>
                </ul>
            </div>
            <div class="l-b">
                <h4>昨日营运数据</h4>
                <ul>
                    <li class="myBg">
                        <h5>旅客量</h5>
                        <strong id="cus_cnt"></strong><span class="unit">人<small>(VIP:<span id="vip_num"></span>人)</small></span>
                    </li>
                    <li class="myBg">
                        <h5>货运量</h5>
                        <strong id="wgt"></strong><span class="unit">吨</span>
                    </li>
                </ul>
                <div class="chartBox" id="ec01_circle_passengerLevel"></div>
            </div>
        </div>
        <div class="m">
            <div class="m-t">
                <div class="chartBox" id="ec02_map_airLines"></div>
                <ul>
                    <li><h5>昨日客座率</h5><strong id="cus_site_ratio"></strong><span class="unit">%</span></li>
                    <li><h5>昨日平均票价</h5><strong id="avg_pri_with_charter"></strong><span class="unit">元</span></li>
                </ul>
            </div>
            <div class="m-b myBg">
                <h4>安全分析</h4>
                <header class="myBg">
                    <i class="icon-eventLight"></i>
                    本周二级（含）以上超限事件<strong id="CNT"></strong><span class="unit">起</span>
                </header>
                <ul>
                    <li><i class="icon-clock"></i>
                        <h5>累计安全运行天数：</h5>
                        <strong id="fly_days"></strong><span class="unit">天</span>
                    </li>
                    <li><i class="icon-plane"></i>
                        <h5>本周安全运行：</h5>
                        <strong id="act_fly_hour"></strong><span class="unit">小时</span>&emsp;
                        <strong id="flight_move_cnt"></strong><span class="unit">架次</span>
                    </li>
                </ul>
            </div>
        </div>
        <div class="r">
            <div class="r-t myBg">
                <h3>整体运行情况</h3>
                <div class="r-t-t">
                    <h4>今日计划航班</h4>
                    <ul>
                        <li>
                            <h5>今日计划航班总量</h5>
                            <strong id="TOTAL_COUNT"></strong><span class="unit">架次</span>
                        </li>
                        <li>
                            <h5>已执行</h5>
                            <strong id="FLIGHTED_COUNT"></strong>
                        </li>
                        <li>
                            <h5>执行中</h5>
                            <strong id="PLAN_FLIGHT_COUNT"></strong>
                        </li>
                    </ul>
                    <div class="flyTime myBg">
                        <div>昨日飞行时间:<strong id="foc3_act_fly_hour"></strong><span class="unit">小时</span></div>
                        <div>昨日利用率:<strong id="daily_use_ratio"></strong><span class="unit">小时</span></div>
                    </div>
                    <ul>
                        <li>
                            <h5>当前航班正常率</h5>
                            <strong id="NORMAL_RATE"></strong>
                        </li>
                        <li>
                            <h5>备降</h5>
                            <strong id="BF_COUNT"></strong>
                        </li>
                        <li>
                            <h5>取消</h5>
                            <strong id="CANCEL_COUNT"></strong>
                        </li>
                        <li>
                            <h5>延误</h5>
                            <strong id="DELAY_COUNT"></strong>
                        </li>
                    </ul>
                </div>
                <div class="r-t-b">
                    <h4>近七日公司原因不正常航班</h4>
                    <div class="chartBox" id="ec03_line_abnormalFlight"></div>
                </div>
            </div>
            <div class="r-b myBg">
                <h4>油量统计</h4>
                <ul>
                    <li class="myBg">
                        <h5>油量统计</h5>
                        <strong id="usedFuelTotal"></strong><span class="unit">吨</span>
                    </li>
                    <li class="myBg">
                        <h5>小时油量</h5>
                        <strong id="avgUsedFuel"></strong><span class="unit">吨</span>
                    </li>
                </ul>
                <ul>
                    <li class="myBg">
                        <h5>节油</h5>
                        <strong id="economyFuelTotal"></strong><span class="unit">吨</span>
                    </li>
                    <li class="myBg">
                        <h5>油价</h5>
                        <strong id="fulePrice"></strong><span class="unit">元/吨</span>
                    </li>
                    <li class="myBg">
                        <h5>耗油成本</h5>
                        <strong id="usedMoneyTotal"></strong><span class="unit">万</span>
                    </li>
                </ul>
            </div>
        </div>
    </main>
</div>

<!--<script src="assets/js/echarts-4.2.0.js"></script>-->
<script src="assets/js/echarts-4.2.0.min.js"></script>
<script src="js/chartsCom.js"></script>
<script src="js/index.js"></script>

</body>
</html>
